@import "../see/components";
body{
  background: #f1f1f1;
}
#goodsDetails{
  position: relative;
  padding-bottom: 0.98rem;
}
.purchase-slider{
  height: 7.14rem;
  .swiper-container{
    width: 100%;
    height: 100%;
    img{
      width: 100%;
      height: 100%;
    }
    .swiper-pagination {
      left: auto;
      right: 0.3rem;
      bottom: 0.3rem;
      width: 0.8rem;
      height: 0.42rem;
      line-height: 0.42rem;
      background-color: rgba(0, 0, 0, 0.3);
      border-radius: 21px;
      text-align: center;
      font-size: 0.26rem;
      color: #fff;
    }
    .swiper-pagination-total {

    }
    .swiper-pagination-current{
      font-size: 0.34rem;
    }
  }
}
.goodsDetails-header{
  position: absolute;
  top: 0.09rem;
  left: 0;
  z-index: 100;
  width: 100%;
  height: 0.74rem;
  span{
    display: block;
    width: 0.74rem;
    height: 0.74rem;
  }
  .goodsDetails-gobk{
    float: left;
    margin-left: 0.16rem;
    //width: 0.68rem;
    //height: 0.68rem;
    background: url("/imgs/purchase/goodsDetails/goodsDetails-gobk.png") no-repeat center;
    background-size: 100% 100%;
  }
  .goodsDetails-cart{
    float: right;
    margin-right: 0.16rem;
    //width: 0.68rem;
    //height: 0.68rem;
    //background: url("/imgs/purchase/goodsDetails/goodsDetails-fx.png") no-repeat center;
    //background-size: 0.68rem 0.68rem;
    background: url(/imgs/purchase/index/purchase-cart.png) no-repeat center;
    background-size: 100% 100%;
  }
  .goodsDetails-more{
    float: right;
    margin-right: 0.16rem;
    //width: 0.68rem;
    //height: 0.68rem;
    background: url("/imgs/purchase/goodsDetails/goodsDetails-more.png") no-repeat center;
    background-size: 100% 100%;
  }
}
.goodsDetails-title{
  padding: 0.2rem 0.3rem 0;
  background: #fff;
  //border-bottom: 1px solid #e2e2e2;
  h6{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: inherit;
    font-size: 0.36rem;
    color: #333333;
  }
  strong{
    margin: 0 0.08rem;
    font-size: 0.45rem;
  }
  .title-money{
    height: 1.1rem;
    line-height: 1.1rem;
    font-size: 0.28rem;
    color: #999;
  }
  .title-moneyNum{
    font-size: 0.5rem;
    color: #EF593C;
    span{
      margin-right: 0.08rem;
      font-size: 0.3rem;
    }
  }
  .title-moneyNum1{
    font-size: 0.32rem;
    color: #666666;
    padding-left: 0.4rem;
    background: url(/imgs/purchase/goodsDetails/goodsDetails-icon.png) no-repeat left center;
    background-size: 0.3rem 0.3rem;
    vertical-align: 0.03rem;
  }
  .title-moneyRight{
    float: right;
  }
}
.goodsDetails-top{
  padding-left: 0.3rem;
  background: #fff;
}
.purchase-more2{
  position: absolute;
  top: 50%;
  right: 0.2rem;
  margin-top: -0.3rem;
  height: 0.6rem;
  width: 0.6rem;
  background: url(/imgs/purchase/goodsDetails/goodsDetails-mone.png) no-repeat center;
  background-size: 0.6rem 0.6rem;
}
.goodsDetails-topOther{
  position: relative;
  height: 0.99rem;
  line-height: 0.99rem;
  font-size: 0.28rem;
  color: #333;
  border-bottom: 1px solid #eee;
  .topOther-lable{
    display: inline-block;
    width: 1.2rem;
    color: #999;
  }
  .goodsDetails-icon1,.goodsDetails-icon2{
    margin-right: 0.1rem;
    display: inline-block;
    width: 1rem;
    height: 100%;
    text-align: center;
    font-size: 0.24rem;
    color: #fff;
  }
  .goodsDetails-icon1{
    background: url(/imgs/purchase/goodsDetails/goodsDetails-icon1.png) no-repeat center;
    background-size: 100% 0.38rem;
  }
  .goodsDetails-icon2{
    background: url(/imgs/purchase/goodsDetails/goodsDetails-icon2.png) no-repeat center;
    background-size: 100% 0.38rem;
  }
}
.goodsDetails-comment{
  margin-top: 0.2rem;
  background: #FFFFFF;
  .comment-tab{
    padding: 0.4rem 0.3rem 0.1rem 0.15rem;
    font-size: 0;
    span{
      margin-left: 0.15rem;
      display: inline-block;
      width: 1.6rem;
      height: 0.5rem;
      line-height: 0.5rem;
      text-align: center;
      font-size: 0.24rem;
      color: #666666;
      background: #FFF0ED;
      border-radius: 100px;
    }
  }
  .comment-cent{
    padding-left: 0.3rem;
  }
  .comment-list{
    padding: 0.3rem 0 0.35rem;
    border-bottom: 1px solid #eee;
    h6{
      padding: 0.3rem 0.3rem 0 0;
    }
    >p{
      margin-top: 0.2rem;
    }
    h6{
      font-size: 0.28rem;
      font-weight: inherit;
      color: #333333;
    }
    p{
      font-size: 0.24rem;
      color: #999;
    }
  }
  .comment-list:last-child{
    border-bottom: none;
  }
  .comment-listTitle{
    height: 0.72rem;
    line-height: 0.72rem;
    font-size: 0.26rem;
    color: #333333;
  }
  .comment-headImg{
    float: left;
    margin-right: 0.2rem;
    width: 0.72rem;
    height: 0.72rem;
    background: #ccc;
    background-size: 100%;
    border-radius: 50%;
  }
  .comment-headName{
    margin-right: 0.1rem;
  }
  .comment-data{
    float: right;
    margin-right: 0.3rem;
    font-size: 0.24rem;
    color: #999;
  }
  .comment-listImg{
    margin-top: 0.3rem;
    height: 1.5rem;
    img{
      margin-right: 0.2rem;
      float: left;
      width: 1.5rem;
      height: 1.5rem;
    }
  }
}
.goodsDetails-sppls,.goodsDetails-sppls1{
  display: inline-block;
  width: 0.22rem;
  height: 0.21rem;
}
.goodsDetails-sppls{
  position: relative;
  margin-right: 0.05rem;
  background: url(/imgs/purchase/goodsDetails/goodsDetails-sppls.png) no-repeat center;
  background-size: 100%;
}
.goodsDetails-sppls1{
  position: absolute;
  top: 0;
  left: 0;
  background: url(/imgs/purchase/goodsDetails/goodsDetails-sppls1.png) no-repeat center;
  background-size: 100%;
}
.goodsDetails-commentTitle{
  padding-left: 0.3rem;
  position: relative;
  height: 1rem;
  line-height: 1rem;
  font-size: 0.3rem;
  color: #333;
  border-bottom: 1px solid #eee;
  span{
    margin-right: 0.7rem;
    float: right;
    color: #999;
  }
}
.goodsDetails-shops{
  margin: 0.2rem 0;
  background: #FFFFFF;
  overflow: hidden;
  .shops-topHead{
    position: relative;
    padding: 0.3rem;
    height: 0.8rem;
    strong{
      float: left;
      width: 0.8rem;
      height: 0.8rem;
      //background: #eee;
      background-size: 100% 100%;
    }
    h6,p{
      padding: 0 1.7rem 0 1rem;
    }
    h6{
      margin-bottom: 0.05rem;
      font-size: 0.3rem;
      color: #333333;
    }
    p{
      font-size: 0.2rem;
      color: #999;
    }
    .topHead-num{
      margin-left: 0.3rem;
    }
    a{
      position: absolute;
      top: 0.4rem;
      right: 0.3rem;
      display: block;
      width: 1.58rem;
      height: 0.6rem;
      line-height: 0.6rem;
      text-align: center;
      font-size: 0.28rem;
      color: #EF593C;
      border: 1px solid #EF593C;
      border-radius: 0.05rem;
    }
  }
  .shops-cent{
    //padding-bottom: 0.5rem;
    padding-left: 0.1rem;
    li{
      margin-left: 0.17rem;
      float: left;
      width: 2.11rem;
      height: 3.8rem;
      font-size: 0.24rem;
    }
    strong{
      display: block;
      height: 2.1rem;
      width: 100%;
      //background: #eee;
      background-size: 100% 100%;
    }
    h6{
      margin: 0.2rem 0 0.15rem;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      white-space: inherit;
      color: #666666;
    }
    p{
      color: #EF593C;
    }
  }
}

.purchase-mons {
  display: inline-block;
  //padding-left: 0.32rem;
  //background: url("/imgs/purchase/index/purchase-mons.png") no-repeat left center;
  //background-size: 0.24rem 0.24rem;
  color: #EF593C;
}

.goodsDetails-Btn{
  margin-top: 0.2rem;
  height: 1rem;
  line-height: 1rem;
  font-size: 0.3rem;
  color: #666666;
  background: #fff;
  text-align: center;
  //transition-duration: 0ms;
  //transform:translate3d(0px,89px,0px);
  span{
    display: inline-block;
    padding-left: 0.3rem;
    height: 100%;
  }
  .goodsDetails-up{
    background: url("/imgs/purchase/goodsDetails/goodsDetails-up.png") no-repeat left center;
    background-size: 0.24rem 0.12rem;
  }
  .goodsDetails-down{
    background: url("/imgs/purchase/goodsDetails/goodsDetails-down.png") no-repeat left center;
    background-size: 0.24rem 0.12rem;
  }
}
.goodsDetails-butt{
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 2000;
  height: 0.98rem;
  line-height: 0.98rem;
  width: 100%;
  background: #fff;
  text-align: right;
  border-top: 1px solid #eee;
  font-size: 0;
  >span{
    position: absolute;
    top: 0;
    display: block;
    width: 1rem;
    height: 100%;
    border-right: 1px solid #e2e2e2;
  }
  a{
    float: right;
    font-size: 0.3rem;
    color: #fff;
    //width: 2.1rem;
    //width: 2.6rem;
    width: 50%;
    height: 100%;
    text-align: center;
  }
  .goodsDetails-buttBtn{
    background: #EF593C;
  }
  .goodsDetails-buttBtn1{
    background: #2693e5;
  }
  .goodsDetails-buttColor{
    color: #333;
  }
  .goodsDetails-video{
    display: inline-block;
    margin-left: 0.12rem;
    vertical-align: middle;
    width: 0.39rem;
    height: 100%;
    background: url("/imgs/purchase/goodsDetails/goodsDetails-video.png") no-repeat center 0.3rem;
    background-size: 0.39rem 0.3rem;
  }
  .goodsDetails-kefu{
    left: 1rem;
    background: url("/imgs/purchase/goodsDetails/goodsDetails-kefu.png") no-repeat center;
    background-size: 0.65rem 0.62rem;
  }
  .goodsDetails-icon3{
    left: 0;
    background: url("/imgs/purchase/goodsDetails/goodsDetails-icon3.png") no-repeat center;
    background-size: 0.45rem 0.41rem;
  }
  .goodsDetails-icon4{
    left: 2rem;
    background: url("/imgs/purchase/goodsDetails/goodsDetails-icon4.png") no-repeat center;
    background-size: 0.43rem 0.41rem;
  }
  //.goodsDetails-kefu{
  //  border-left: 1px solid #ccc;
  //  left: 1rem;
  //  background: url("/imgs/purchase/goodsDetails/goodsDetails-kefu.png") no-repeat center;
  //  background-size: 100%;
  //}
  .goodsDetails-cuwux{
      //border-left: 1px solid #ccc;
      left: 1rem;
      background: url("/imgs/purchase/shoppingCart/gwc-icon.png") no-repeat center;
      background-size: 0.55rem 0.55rem;
  }
  .goodsDetails-news{
    position: absolute;
    top: 0.18rem;
    left: 1.6rem;
    display: block;
    width: 0.26rem;
    height: 0.26rem;
    line-height: 0.26rem;
    text-align: center;
    background: #EF593C;
    border-radius: 0.13rem;
    color: #fff;
    font-size: 0.2rem;
  }

}

.goodsDetails-InfoTitle{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  height: 0.89rem;
  line-height: 0.89rem;
  width: 100%;
  text-align: center;
  font-size: 0.26rem;
  color: #333;
  background: #fefefe;
  border-bottom: 1px solid #eee;
  span{
    position: absolute;
    top: 50%;
    display: block;
    margin-top: -0.3rem;
    width: 0.6rem;
    height: 0.6rem;
  }
  strong{
    display: inline-block;
    height: 0.85rem;
    font-weight: inherit;
  }
  .ml3{
    margin: 0 0.3rem;
  }
  .active{
    font-size: 0.3rem;
    color: #333;
    border-bottom: 0.04rem solid #0092ff;
  }
  .goback{
    left: 0.2rem;
    background: url(/imgs/see/selfMedia/selfMediaPage-goback.png) no-repeat left center;
    background-size: 0.6rem 0.6rem;
  }
  //.discount-spsre{
  //  right: 0.2rem;
  //  background: url(/imgs/purchase/newProduct/discount-spsre.png) no-repeat left center;
  //  background-size: 0.6rem 0.6rem;
  //}
  .goodsDetails-cart{
    right: 0.8rem;
    background: url(/imgs/purchase/goodsDetails/goodsDetails-cart.png) no-repeat center;
    background-size: 0.45rem 0.45rem;
  }
  .goodsDetails-more1{
    right: 0.2rem;
    background: url(/imgs/purchase/goodsDetails/goodsDetails-more1.png) no-repeat right center;
    background-size: 0.4rem 0.4rem;
  }
}
.goodsDetails-Btn1{margin-top: 0.89rem;}
.goodsDetails-InfoCent{
  padding-bottom: 0.1rem;
  background: #fff;
  .InfoCent-text{
    margin: 0 0 0.2rem 0.3rem;
    li{
      height: 0.8rem;
      line-height: 0.8rem;
      border-bottom: 1px solid #eee;
      font-size: 0.228rem;
      color: #333333;
    }
    span{
      display: inline-block;
      width: 2.03rem;
      color: #999;
    }
  }
  .InfoCent-Img{
    padding: 0.2rem;
    font-size: 0.3rem;
    color: #333;
    img{
      display: block;
      width: 100% !important;
      min-height: 3rem;
      height: auto !important;
    }
  }
}

.goodsDetails-evaluateTop{
  margin: 0.89rem 0 0.2rem;
  padding-left: 0.3rem;
  background: #fff;
}
.evaluateTop{
  height: 1rem;
  line-height: 1rem;
  font-size: 0.3rem;
  color: #999999;
  .evaluateTop-left{
    margin-right: 0.1rem;
    color: #333;
  }
  .evaluateTop-right{
    margin-left: 0.12rem;
  }
}
.evaluate-classfiy{
  margin-left: -0.15rem;
  padding-bottom: 0.1rem;
  font-size: 0;
  strong{
    display: inline-block;
    padding: 0 0.25rem;
    margin: 0 0 0.22rem 0.15rem;
    height: 0.54rem;
    line-height: 0.54rem;
    text-align: center;
    color: #666666;
    font-size: 0.26rem;
    font-weight: inherit;
    background-color: #e9f6ff;
    border-radius: 27px;
    border: solid 1px #e9f6ff;
    span{
      font-weight: bold;
    }
    .goodsDetails-icon{
      display: inline-block;
      width: 0.2rem;
      height: 100%;
      text-align: center;
    }
    .active{
      background-color: #ffffff;
      border: solid 1px #0092ff;
    }
  }
}
.goodsDetails-evaluateList{
  padding-left: 0.3rem;
  margin-top: 0;
  .comment-list{
    padding-bottom: 0.3rem;
    border-bottom: 1px solid #eee;
  }

}
.goodsDetails-evaluateList:last-child{
  .comment-list{
    border-bottom: 0;
  }
}
.evaluateList-butt{
  padding-top: 0.2rem;
  height: 1rem;
  p{
    margin-bottom: 0.05rem;
  }
}
.evaluateList-reply{
  margin-right: 0.3rem;
  //width: 690px;
  //height: 112px;
  padding: 0.22rem 0.4rem 0.26rem 0.2rem;
  background-color: #f5f5f5;
  font-size: 0.25rem;
  color: #333333;
}
.goodsDetails-zkTop{
  margin-left: -0.3rem;
  padding-left: 0.3rem;
  height: 0.6rem;
  line-height: 0.6rem;
  background-color: #363c40;
  color: #ffffff;
  font-size: 0.26rem;
  strong{
    margin-right: 0.1rem;
    color: #f44834;
  }
  .zkTop-data{
    float: right;
    margin-right: 0.16rem;
    span{
      margin: 0 0.05rem;
      display: inline-block;
      width: 0.36rem;
      height: 0.36rem;
      line-height: 0.36rem;
      text-align: center;
      font-size: 10px;
      color: #fff;
      background: #566067;
      border-radius: 50%;
    }
    span:first-child{
      margin-left: 0.1rem;
    }
  }
}
.goodsDetails-zkSpeed{
  margin-left: -0.3rem;
  background: #566067;
  height: 0.05em;
  span{
    display: block;
    width: 50%;
    height: 100%;
    background: #f76654;
  }
}
.goodsDetails-zkCent{
  margin-left: -0.3rem;
  height: 1.1rem;
  font-size: 0;
  background-color: #e5f4ff;
  white-space: nowrap;
  overflow: hidden;
  overflow-x: scroll;
  /* 1 */
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
  -webkit-overflow-scrolling: touch;
  /* 2 */
  text-align: justify;
  /* 3 */
  li{
    position: relative;
    display: inline-block;
    padding-top: 0.2rem;
    width: 25%;
    height: 0.9rem;
    text-align: center;
    vertical-align: top;
    strong{
      display: block;
      color: #333;
      font-size: 0.3rem;
    }
    span{
      font-size: 0.2rem;
      color: #f44834;
    }
    i{
      position: absolute;
      top: 50%;
      right: -1px;
      margin-top: -0.35rem;
      display: block;
      height: 0.7rem;
      border-left: 1px solid #aacce3;
    }
  }
  .original{
    background: #e9918c;
    strong,span{
      color: rgba(255, 255, 255, 0.5);
    }
  }
  .now{
    background: #d45048;
    strong,span{
      color: #fff;
    }
  }
}
.goodsDetails-zkCent::-webkit-scrollbar {
  display: none;
}
.goodsDetails-zkMoney{
  height: 1.1rem;
  line-height: 1.1rem;
  font-size: 0;
  overflow: hidden;
  border-bottom: 1px solid #eee;
  .zkMoney-left{
    margin-right: 0.15rem;
    font-size: 0.3rem;
    color: #333333;
  }
  .topMeney-icon{
    margin-right: 0.05rem;
    font-size: 0.5rem;
  }
  .zkMoney-right{
    font-size: 0.2rem;
    color: #999;
    i{
      margin: 0 0.2rem;
      display: inline-block;
      border-left: 1px solid #999;
      height: 0.25rem;
      vertical-align: -0.05rem;
    }
  }
}
.purchase-mong {
  margin-left: 0.05rem;
  display: inline-block;
  padding-left: 0.2rem;
  background: url(/imgs/purchase/index/purchase-mong.png) no-repeat left center;
  background-size: 0.2rem 0.2rem;
}
#mask{
  background: rgba(0,0,0,.8);
}
.goodsDetails-choice{
  padding: 0.4rem 0;
  position: fixed;
  left: 0;
  bottom: 0.99rem;
  z-index: 2000;
  width: 100%;
  background: #fff;
  >div{
    margin: 0 0.3rem;
    overflow: hidden;
  }
  .goodsDetails-choiceCent{
    height: 4.5rem;
    overflow-y: auto;
  }
  p{
    font-size: 0.3rem;
    color: #333333;
  }
  .goodsDetails-choiceBtn{
    position: absolute;
    top: 0.1rem;
    right: 0.3rem;
    font-size: 0.6rem;
  }
  .choice-top{
    .choice-topmt{
      padding-top: 0.65rem;
    }
    .stocks{
      color: #999;
    }
    strong{
      float: left;
      width: 2rem;
      height: 2rem;
      //background: #666;
      background-size: 100% 100%;
    }
    p{
      margin-top: 0.05rem;
      padding-left: 2.18rem;
    }
  }
  .choice-cent,.choice-butt{
    font-size: 0;
  }
  .choice-cent{
    padding-bottom: 0.1rem;
    border-bottom: 1px solid #f1f1f1;
    p{
      height: 0.8rem;
      line-height: 0.8rem;
    }
    span{
      display: inline-block;
      margin: 0 0.1rem 0.2rem 0;
      padding: 0 0.35rem;
      height: 0.6rem;
      line-height: 0.6rem;
      //border-radius: 4px;
      background: #FFF0ED;
      border-radius: 100px;
      border: solid 1px #FFF0ED;
      color: #666;
      font-size: 0.28rem;
    }
    .active{
      background: #FFFFFF;
      border: 1px solid #EF593C;
      color: #EF593C;
    }
  }
  .choice-butt{
    position: relative;
    margin-top: 0.2rem;
    //width: 3rem;
    p{
      height: 0.68rem;
      line-height: 0.68rem;
    }
    .choice-buttDiv{
      position: absolute;
      top: 0;
      right: 0;
      width: 3rem;
      height: 0.64rem;
      line-height: 0.64rem;
      border: 1px solid #eee;
      text-align: center;
      color: #666;
      font-size: 0.28rem;
    }
    input{
      float: left;
      width: 1.2rem;
      height: 95%;
      background: none;
      border: none;
      font-size: 0.2rem;
      text-align: center;
    }
    span{
      display: inline-block;
      width: 0.75rem;
      height: 100%;
      font-size: 0.5rem;
    }
    .choice-buttBtn1{
      float: left;
      border-right: 1px solid #eee;
    }
    .choice-buttBtn2{
      float: right;
      border-left: 1px solid #eee;
    }
  }
}
//秒杀 start
.goodsDetails-MSTop{
  padding-left: 0;
  strong{
    float: left;
    width: 4.1rem;
    height: 100%;
    background: #ff8f3d url("/imgs/purchase/goodsDetails/goodsDetails-ms.png") no-repeat 0.3rem center;
    background-size: 50%;
  }
}
.goodsDetails-MScent{
  margin-left: -0.3rem;
}
.secondKill-snatch{
  position: relative;
  height: 1rem;
  line-height: 1rem;
  font-size: 0;
  overflow: hidden;
  border-bottom: 1px solid #eee;
}
.secondKill-snatchLeft{
  position: relative;
  z-index: 101;
  float: left;
  padding: 0.2rem 0.1rem;
  width: 0.7rem;
  line-height: 0.3rem;
  text-align: center;
  color: #f44834;
  font-size: 0.18rem;
  background: #fefefe;
}
.secondKill-snatchCent{
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  float: left;
  margin-left: 0.9rem;
  font-size: 0.24rem;
  color: #999;
  width: 87.5%;
  .swiper-container {
    width: 100%;
    height: 100%;
  }
  //>div{
  //  //margin-left: -65px;
  //  width: 400%;
  //  height: 100%;
  //}
  .snatchCent-list{
    //position: relative;
    //float: left;
    //margin-left: -10px;
    //margin-right: 0.1rem;
    //padding-left: 0.4rem;
    //padding-right: ;
    //padding-right: 5px;
    height: 1rem;
    line-height: 1rem;
    width: 1.3rem;
    //white-space: nowrap;
    //border: 1px solid red;
    strong{
      //position: absolute;
      //left: 0;
      //top: 0;
      margin-right: 0.05rem;
      display: inline-block;
      //margin-right: 0.04rem;
      width: 0.36rem;
      height: 100%;
      //background: url(/imgs/purchase/newProduct/discount-spsre.png) no-repeat left center;
      background: no-repeat left center;
      background-size: 0.36rem 0.36rem;
      border-radius: 50%;
      vertical-align: middle;
    }

  }
}
//爆款 start
.goodsDetails-BKTop{
  padding-left: 0;
  strong{
    float: left;
    width: 4.1rem;
    height: 100%;
    background: #f76654 url("/imgs/purchase/goodsDetails/goodsDetails-bk.png") no-repeat 0.3rem center;
    background-size: 50%;
  }
}

div#mask{display: none;}
#maskBox{
  display: none;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 2000;
  width: 100%;
  height: 3.65rem;
  background: rgba(255,255,255,.95);
}
.maskBox-top{
  height: 0.8rem;
  line-height: 0.8rem;
  font-size: 0.3rem;
  color: #333333;
  text-align: center;
  border-bottom: 1px solid #e2e2e2;
}
.maskBox-cent{
  padding: 0.28rem 0 0.3rem;
  font-size: 0.2rem;
  color: #333333;
  white-space: nowrap;
  overflow: hidden;
  overflow-x: scroll;
  /* 1 */
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
  -webkit-overflow-scrolling: touch;
  /* 2 */
  text-align: justify;
  /* 3 */
  /*border-top: 1px solid #e2e2e2;*/
  span{
    display: inline-block;
    padding-top: 0.95rem;
    width: 1.48rem;
    text-align: center;
  }
  .maskBox-icon{
    background: url(/imgs/friend/index/maskBox-icon.png) no-repeat center top;
    background-size: 0.88rem 0.88rem;
  }
  .maskBox-icon1{
    background: url(/imgs/friend/index/maskBox-icon1.png) no-repeat center top;
    background-size: 0.88rem 0.88rem;
  }
  .maskBox-icon2{
    background: url(/imgs/friend/index/maskBox-icon2.png) no-repeat center top;
    background-size: 0.88rem 0.88rem;
  }
  .maskBox-icon3{
    background: url(/imgs/friend/index/maskBox-icon3.png) no-repeat center top;
    background-size: 0.88rem 0.88rem;
  }
  .maskBox-icon4{
    background: url(/imgs/friend/index/maskBox-icon4.png) no-repeat center top;
    background-size: 0.88rem 0.88rem;
  }
  .maskBox-icon5{
    background: url(/imgs/friend/index/maskBox-icon5.png) no-repeat center top;
    background-size: 0.88rem 0.88rem;
  }
  .maskBox-close{
    background: url(/imgs/friend/index/maskBox-close.png) no-repeat center top;
    background-size: 0.88rem 0.88rem;
  }

}
.maskBox-cent::-webkit-scrollbar {
  display: none;
}
.maskBox-btn{
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1rem;
  line-height: 1rem;
  text-align: center;
  font-size: 0.31rem;
  color: #333333;
  background: #fff;
  border-top: 1px solid #e2e2e2;
}
.maskShow{
  display: block !important;
}